import * as React from 'react';

import AbsSimpleAttrRenderer from './AbsSimpleAttrRenderer';
import {IAttrValue} from '../../../types/IAttrValue';

class SelectAttrRenderer extends AbsSimpleAttrRenderer<undefined> {

  protected renderContent() {
    const {attribute} = this.props;
    const attrVal: any = this.getAttrVal();

    return (
      <select name={attribute.name} value={attrVal} onChange={this.changeHandler}>
        <option value="">---</option>
        {attribute.values.map(value => this.renderOption(value))}
      </select>
    );
  }

  private renderOption(value: IAttrValue) {
    return (
      <option key={value.name} value={value.name}>{value.display}</option>
    );
  }
}

export default SelectAttrRenderer;
